body{ background: url(../images/bg.jpg) no-repeat #00080F; font-size: 18px; color: #fff; overflow: hidden;}
@font-face {
    src: url('../fonts/ZhengQingKeHuangYouTi-1.ttf');
    font-family: ZhengQingKeHuangYouTi
}
@font-face {
    src: url('../fonts/DIN-Bold.otf');
    font-family: DIN-Bold
}
@font-face {
    src: url('../fonts/LIANMENGQIYILUSHUAIZHENGRUIHEITI-2.ttf');
    font-family: LIANMENGQIYILUSHUAIZHENGRUIHEITI
}
.scroll-body{ height: 100%; width: 1920px; overflow-x: hidden; overflow-y: auto; transform-origin: left top 0px;}
.main{ background: url(../images/main-bg.png) no-repeat center 16px; width: 1888px; padding-top: 16px; position: relative; }
/*.iframe-body{ box-sizing: border-box; overflow: hidden; width: 1888px; }*/
#main_iframe{ width: 100%; height: 976px; }
.main-content{ padding: 1rem; border: 1px solid #0184e0; border-top: none; border-radius: 0 0 3px 3px;}

.top-nav{ height: 84px; }
.top-nav-left{ width: 1368px;}
.company-info{ margin-left: 16px; width: 424px; }
.company-logo{ width: 60px; height: 60px; border-radius: 50%; border: 1px solid #0096FF; overflow: hidden; margin-right: 18px; }
.company-logo .logo{ width: 100%; height: 100%;}
.nav-menu{ width: 870px; }
.nav-menu a{ background: url(../images/top-nav-btn-bg.png) no-repeat; width: 132px; height: 44px; line-height: 44px;
    transition: all 0.3s; color: #99ACC9; display: inline-block; text-align: center; font-weight: 600;}
.nav-menu a:hover{ color: #fff;}
.nav-menu a.active{ background-image: url(../images/top-nav-btn-bg-active.png); color: #fff; }
.click-icon a{ color: #fff;}
.click-icon a:hover{ opacity: 0.8; }
.click-icon a:nth-child(1):hover{ color: #FF7931;}
.click-icon a:nth-child(2):hover{ color: #83D0EF;}
.click-icon a:nth-child(3):hover{ color: #F95959;}
.alarm-icon-dot{ position: absolute; display: inline-block; top: 50%; right: 1px; margin-top: -12px;
    width: 8px; height: 8px; border-radius: 50%; background-color: #FE5C5C; border: 1px solid #fff; }

/*四个工作状态的颜色*/
.text-powerOn{ color: #00E3D2; }
.text-standby{ color: #0096FF; }
.text-powerOff{ color: #D1D1D1; }
.text-fault{ color: #FF7931; }
/*峰谷平颜色*/
.text-peak{ color: #FF8B35 !important}
.text-valley{ color: #009AEA !important}
.text-level{ color: #F2CB6B !important}

.text-week{ color: #06D9D4;}
.text-month{ color: #FAD488;}
.text-emphasize{ color: #12B0DE; }
.text-blue{ color: #75D9FF;}
.text-purple{ color: #718BF3}
.text-red{ color: #F95959}
.text-blue-a{ color: #83D0EF}
.text-aqua{ color: #1BF6F7;}
.text-bolder{ font-family: DIN-Bold;}
.text-number{ font-family: ZhengQingKeHuangYouTi;}
.text-company{ font-family: LIANMENGQIYILUSHUAIZHENGRUIHEITI;}

.bg-paragragh{ background: #0D2C54; }
.bg-dark-cus{ background: #001A2D; }
.bg-chart{ background: #0C152D;}

a{ color: #1396DB;}
a:hover{ text-decoration: none; color: #0c7fbb; }
a.text-blue:hover{ color: #75D9FF; opacity: 0.8; }
.iconfont{ font-size: inherit; }
.flex-1{ -ms-flex: 1; flex: 1; }
.flex-2{ -ms-flex: 2; flex: 2; }
.flex-3{ -ms-flex: 3; flex: 3; }

/*设备使用率-进度条*/
.custom-progress{ background: url(../images/custom-progress-bg.png) no-repeat left; border-radius: 0;}
.custom-progress-bar{ background: url(../images/custom-progress-bar-bg.png) no-repeat left;}
/*设备使用率-点型使用率*/
.usage-icon{ background: url(../images/icon/usage-icon.png) no-repeat; width: 16px; height: 16px; display: inline-block;}
.usage-icon.active{ background-image: url(../images/icon/usage-icon-active1.png);}
.usage-wrapper .col-6{ margin-bottom: 8px;}
.usage-wrapper .col-6:nth-child(10n+3) .usage-icon.active,.usage-wrapper .col-6:nth-child(10n+4) .usage-icon.active{ background-image: url(../images/icon/usage-icon-active2.png)}
.usage-wrapper .col-6:nth-child(10n+5) .usage-icon.active,.usage-wrapper .col-6:nth-child(10n+6) .usage-icon.active{ background-image: url(../images/icon/usage-icon-active3.png)}
.usage-wrapper .col-6:nth-child(10n+7) .usage-icon.active,.usage-wrapper .col-6:nth-child(10n+8) .usage-icon.active{ background-image: url(../images/icon/usage-icon-active4.png)}
.usage-wrapper .col-6:nth-child(10n+9) .usage-icon.active,.usage-wrapper .col-6:nth-child(10n+10) .usage-icon.active{ background-image: url(../images/icon/usage-icon-active5.png)}
/*用电统计-电费*/
.charge-span{ position: absolute; font-size: 12px; text-align: center; font-weight: 600;}
.charge-span.month{ top: 57px; left: 18px; width: 93px; font-size: 14px;}
.charge-span.today{ top: 80px; left: 91px; width: 63px;}
.charge-span.yesterday{ top: 35px; left: 102px; width: 48px;}

/*面包屑*/
.breadcrumb{ background-color: #fff; font-size: 14px; color: #666666; margin: 0; padding: 0;}
.breadcrumb-item.active{ color: #057AFF;}

/*section*/
.border-section{ border: 1px solid #0096FF; padding: 0 16px; }
.custom-section{ background: #ffffff; border-radius: 2px; padding: 20px; }
.section-title{ color: #18FFFF; font-size: 20px;}
.title-icon{ background: url(../images/title-decoration.png) no-repeat bottom left; width: 76px;
    display: inline-block; height: 24px; vertical-align: top;}
.border-section .section-title{ margin-top: 11px}

/*表单*/
.form-control{ background: #00337E; border-radius: 0; border: none; font-size: 16px; color: #fff; }
.form-control.time-picker{ background: url(../images/icon/time-picker.png) no-repeat right .75rem center #00337E; }
.form-control:disabled, .form-control[readonly]{  background-color: #00337e; color: rgba(255, 255, 255, 0.6);  }
.form-control:focus { background: radial-gradient(rgba(0,0,0,0), #0056D4);
    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16); color: #fff;}
.form-control.time-picker:focus { background: url(../images/icon/time-picker.png) no-repeat right .75rem center, radial-gradient(rgba(0,0,0,0), #0056D4);}
.form-control:disabled:focus, .form-control[readonly]:focus{  background: #00337e; color: rgba(255, 255, 255, 0.6);  }
select.form-control{ -webkit-appearance:none; -moz-appearance:none; appearance:none; padding-right: 32px;
    background: url(../images/icon/select-arrow.png) no-repeat right .75rem center #00337E; }
select.form-control::-ms-expand{ display: none; }
select.form-control:focus{ background: url(../images/icon/select-arrow.png) no-repeat right .75rem center,
    radial-gradient(rgba(0,0,0,0), #0056D4);}
select.form-control:focus option{ color: #333;}
.form-control::-webkit-input-placeholder{ color: rgba(255,255,255,0.6);}
.form-control::-moz-input-placeholder{ color: rgba(255,255,255,0.6);}
.form-control::-ms-input-placeholder{ color: rgba(255,255,255,0.6);}
/*button*/
.btn{ font-size: 16px; border: none; border-radius: 0; }
.btn-sm { font-size: 14px;}
.btn-primary{ background-color: #0056D4; }
.btn-primary:hover{ background-color: rgba(0, 85, 212, 0.8); }
.btn-success{ background-color: #63C44C;}
.btn-success:hover{ background-color: rgba(98, 196, 76, 0.8);}
.btn-danger{ background-color: #F25F4E;}
.btn-danger:hover{ background-color: rgba(242, 94, 78, 0.8);}
.btn-secondary{ background-color: #707070;}
.btn-secondary:hover{ background-color: rgba(112, 112, 112, 0.8);}
.btn-inactive{ background-color: #001836; color: rgba(255, 255, 255, 0.5);}
.btn-inactive:hover{ background-color: #002a69; color: rgba(255, 255, 255, 0.5);}
.btn-warning{ background-color: #F6AB12; color: #fff;}
.btn-warning:hover{ background-color: rgba(246,171,18,0.8); color: #fff;}
.btn-outline-success{ border: 1px solid #18FFFF; background: transparent; color: #18FFFF;}
.btn-outline-success:hover{ border: 1px solid #18FFFF; background: #17CBCC;}
.btn-outline-danger{ border: 1px solid #F25F4E; background: transparent; color: #F25F4E;}
.btn-outline-danger:hover{ border: 1px solid #F25F4E; background: #F25F4E;}
.circle-btn svg{ width: 32px; height: 32px;}
.circle-btn:hover{ opacity: 0.8;}
.explain-btn{ background: url(../images/explain-btn.png) no-repeat; width: 158px; height: 44px; color: #00E3D2; font-size: 16px;
    display: inline-block;line-height: 44px;text-align: center; background-size: 100% 100%;}
.explain-btn:hover,.explain-btn.active{ background-color: #003179; color: #00E3D2;}
.green-a{ color: #00E3D2; }
.green-a:hover{ color: #00E3D2; opacity: 0.8; }
.grey-a{ color: #D1D1D1;}
.grey-a:hover{ color: #fff;}
.grey-a.disabled{ color: #99ACC9; cursor: not-allowed;}

.custom-control-label{ font-size: 16px;}
.col-form-label{ text-align: right;}
.modal .form-control{ font-size: 14px; height: 36px; border: 1px solid #0096FF;}
.modal textarea.form-control { height: auto;}
.modal label { margin-bottom: .35rem; font-size: 14px; }
.modal .input-group-text{ font-size: 14px;}
.modal-header { padding: 10px 1rem; color: #fff; border-top-left-radius: 0;
    border-top-right-radius: 0; border-bottom: none;}
.modal-header .close,.section-title .close{ color: #fff; opacity: 1; text-shadow: none; padding: 0; margin-top: 5px; margin-right: 0; 
    background-color: #354C6A; font-size: 21px; width: 32px; line-height: 32px; border-radius: 50%;}
.close:not(:disabled):not(.disabled):focus, .close:not(:disabled):not(.disabled):hover {
    opacity: 1; background: #F25F4E; }
.modal-content { border-radius: 0; border: 1px solid #0096ff; background: #031F45; box-shadow: 0 0 0 6px #031F45;}
.modal-sub-title span{ font-size: 16px; border-bottom: 1px solid #007ED0; }
.image-upload-area{ height: 161px; background: #00337E; border: 1px solid #0096FF; width: 100%;}
.image-upload-area img{ max-height: 100%; max-width: 100%;}
.modal .list-group-item { padding: .5rem .75rem;}
.modal-footer{ border-top: 1px solid #011938; justify-content: center;}
.form-required{ color: red; font-size: 20px; position: absolute; margin-left: 2px; margin-top: -2px;}
.form-datatime{ min-width: 195px; }

/*表格样式*/
.table{ color: #fff;}
.table th, .table td{ font-weight: 400; border-top: none;}
.table thead tr{ background: #003179; }
.table thead th{ border-bottom: none; font-size: 20px; }
.table td{ font-size: 16px;}
.table-bordered{ border: 1px solid #0096FF;}
.table-bordered thead th{ border-bottom: 1px solid #0096FF;}
.table-bordered td, .table-bordered th{ border: 1px solid #0096FF; border-top: none; border-bottom: none;}
.table-striped tbody tr:nth-of-type(odd){ background-color: rgba(5,53,123,0.4);}
.table-responsive{ margin-bottom: 1rem; }
.table-responsive .table{ margin-bottom: 0.25rem; }
.table-responsive .table th, .table-responsive .table td{ white-space: nowrap; }
.table-responsive .table .form-control{ min-width: 5rem; }
.table-center.table th, .table-center.table td{ text-align: center; }
.table-sm td, .table-sm th{ padding: 3px;}
.table-sm thead th{ font-size: 16px; padding: 5px 3px;}
.table-sm td{ font-size: 14px;}

/*分页栏*/
.page_div{ text-align:center; font-size: 16px; color: #ccc;}
.page_div.page-simple{ font-size: 14px;}/*简洁版分页*/
.page_div.normal{ background: none; padding-bottom: 0;}
.page_div a{ padding: 0 8px; line-height: 25px; text-align: center; margin: 0 3px; cursor: pointer;
    color: #0096FF !important; display: inline-block; border: 1px solid transparent;}
.page_div.page-simple a{ padding: 0 7px; line-height: 24px; color: #d1d1d1 !important; border: none;}
.page_div .current{ background-color: #0056D4; color: #fff !important; }
.totalPages{margin: 0 10px;}
.totalPages span, .totalSize span{color: #146AB8; margin: 0 5px; font-weight: 600;}
.page_div .goPage{ margin-left: 16px;}
.page_div .goPage .current{  font-size: 14px;}
.page_div input,.page_div select{ padding: 0px 8px; line-height: 24px; height: 24px; background: #00337E; font-size: 14px;
    color: #fff; border: none; text-align: center; margin: 0 5px;}
.page_div input{ width: 64px;  padding-right: 0px;}
.page-decoration{ background: url(../images/page-bg-left.png) no-repeat left bottom, url(../images/page-bg-right.png) no-repeat right bottom; height: 33px; }
/*双箭头式分页*/
.page-arrow{ border: 1px solid #1F9FFF; line-height: 24px; border-radius: 24px; overflow: hidden;}
.page-arrow a{ padding: 0 10px; color: #fff; }
.page-arrow a:hover{ color: #fff; background: #1362FF; }
.page-arrow a.disabled{ color: #99ACC9; background: transparent; cursor: not-allowed; }
.page-arrow a.disabled:hover{ color: #99ACC9; }

.amap-sug-result{z-index:2055}
/*图片预览*/
.img-preview{ width: 100px; height: 100px; background-color: #fff; border: 1px solid rgba(0, 150, 255, 0.5); border-radius: .25rem;
    cursor: pointer;}
table .img-preview{ width: 35px; height: 35px;}
.img-preview.no-style{ width: 100%; height: 100%; background-color:transparent; border: none; border-radius: 0;}
#viewImageModal .modal-dialog{ max-width: 80%; display: -ms-flexbox!important; display: flex!important; -ms-flex-pack: center!important; justify-content: center!important;}
#viewImageModal .modal-content{ width: auto;}

/*配合customModalV2的样式部分*/
/*图表无数据提示*/
.noDataHint_n{ background: url(../images/no-data.png) no-repeat center center; z-index: 1; text-align: center; position: absolute; }
/*弱提示*/
.modal-hint{ position: fixed; top: 48%; left: 50%; background: rgba(0, 0, 0, 0.7); color: #fff; border-radius: 5px; font-size: 24px; z-index:2000; padding: 12px 20px; }
/*强提示*/
.modal-hint.strong{ top: 0; left: 0; border-radius: 0; font-size: 24px; z-index:2001; padding: 0; padding-top: 20%; width: 100%; height: 100%; text-align: center; }
/*旋转动画*/
.rotate{ animation: rotate 2s linear infinite;}
@keyframes rotate{ 0%{ transform:rotate(0deg);} 50%{ transform:rotate(180deg);} 100%{ transform:rotate(360deg);} }

/*定义webkit内核下 滚动条样式*/
::-webkit-scrollbar{ width: 7px; height: 7px; background-color: rgba(0, 0, 0, 0.44);}
::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); box-shadow: inset 0 0 6px rgba(0,0,0,0.3); background-color: #ddd;}
::-webkit-scrollbar-thumb{ border-radius: 3px;-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3); box-shadow: inset 0 0 6px rgba(0,0,0,.3); background-color: #258bd4;}

@keyframes bilingRed {
    0% { box-shadow: 0 0 0 0px #c0392b; }
    25% { box-shadow: 0 0 0 2px #c0392b; }
    50% { box-shadow: 0 0 0 3px #c0392b; }
    75% { box-shadow: 0 0 0 2px #c0392b; }
    100% { box-shadow: 0 0 0 1px #c0392b; }
}
@keyframes bilingRedBg {
    0% { background: url(../images/warning-left.png) repeat-y left 0px,
    url(../images/warning-right.png) repeat-y right  -87px rgba(255, 0, 0, 0.6); background-size: 50px; }

    25% { background: url(../images/warning-left.png) repeat-y left -74px,
    url(../images/warning-right.png) repeat-y right  -13px rgba(255, 0, 0, 0.2); background-size: 50px; }

    50% { background: url(../images/warning-left.png) repeat-y left -149px,
    url(../images/warning-right.png) repeat-y right  62px rgba(255, 0, 0, 0.6); background-size: 50px; }

    75% { background: url(../images/warning-left.png) repeat-y left -224px,
    url(../images/warning-right.png) repeat-y right  137px rgba(255, 0, 0, 0.2); background-size: 50px; }

    100% { background: url(../images/warning-left.png) repeat-y left -298px,
    url(../images/warning-right.png) repeat-y right  211px rgba(255, 0, 0, 0.6); background-size: 50px; }
}

/*layui树结构*/
.layui-tree .layui-icon-file{ display: none;}
.layui-tree-entry{ line-height: 20px; height: auto; white-space: normal; }
.layui-form-checkbox[lay-skin=primary]{ padding-left: 22px;}
.layui-form-checked[lay-skin=primary] i{ border-color: #007bff!important;
    background-color: #1988ff;}
.layui-form-checkbox i{ top: 1px;}
.layui-tree-icon{ width: 14px;}
.layui-tree-line .layui-tree-entry:hover{ background-color: rgba(21, 106, 184, .06);}
.layui-tree-line .layui-tree-entry:hover .layui-tree-txt{ color: #007bff; text-decoration: none;}
.layui-tree-iconClick{ margin: 0px 6px;}

.font-1{ font-size: 1rem; }
.font-p52{ font-size: 52px !important;}
.font-p48{ font-size: 48px !important; }
.font-p40{ font-size: 40px !important; }
.font-p36{ font-size: 36px !important; }
.font-p32{ font-size: 32px !important; }
.font-p28{ font-size: 28px !important; }
.font-p24{ font-size: 24px !important; }
.font-p22{ font-size: 22px !important; }
.font-p20{ font-size: 20px !important; }
.font-p18{ font-size: 18px !important; }
.font-p16{ font-size: 16px !important; }
.font-p14{ font-size: 14px !important; }
.font-p12{ font-size: 12px !important; }


.border-blue{ border: 1px solid #0096FF;}

.custom-scroll-y{ overflow-y: auto; }
.custom-scroll-y::-webkit-scrollbar-track {background-color: #333C44;}
.custom-scroll-y::-webkit-scrollbar-thumb{ background-color: #1890FF;}
.result{ background: url(../images/result-bg.png) no-repeat center; width: 96px; line-height: 142px; text-align: center;}
.result-text{ max-height: 142px; overflow-y: auto; }
.table-report-title td{ font-weight: 600; padding: 7px 20px; font-size: 22px; }
.table-report-title td:nth-child(2n+1){ color: #0087CF;}
.table-report-title td:nth-child(2n){ color: #75D9FF;}

.statistical-data-border{ border: 2px solid #0096FF; padding: 0 24px 3px; position: relative; color: #75D9FF}
.statistical-data-border:after{ border:12px transparent solid; border-top-color:#0096ff; content:" "; position: absolute; margin-left: -10px; display:block;
    z-index:2; left: 50%; margin-top: 3px;}

.nav-underlines{ border-bottom: 1px solid #00355A;}
.nav-underlines .nav-link{ padding: 5px 16px; color: #99ACC9; border-bottom: 4px solid transparent; transition: all 0.3s;}
.nav-underlines .nav-link:hover{ border-bottom: 4px solid #00E3D2;}
.nav-underlines .nav-link.active{ border-bottom: 4px solid #00E3D2; color: #00E3D2;}
.nav-underlines .nav-item+.nav-item{margin-left: 8px;}